<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <ui:composition template="/plantillas/plantillaPrincipal.xhtml">
        <ui:define name="contenido">
            <f:view>
                <h:form id="formBusqMovCtaBancaria">

                    <h:panelGrid columns="1" style="width: 650px;margin: 0px auto">
                        <p:commandButton onclick="dlg2.show();" value="#{message['movctabancaria.consulta.btnNuevo']}" type="button"/>
                    </h:panelGrid>

                    <p:panel id="pnlBusqMovCtaBancaria" header="#{message['movctabancaria.consulta.panel.titulo']}" style="width: 650px;margin: 0px auto" 
                             toggleable="true" widgetVar="buscar" collapsed="#{BKMovCtaBancaria.listaMovCtaBancaria ne null}">
                        <p:panelGrid style="width: 100%" > 
                            <p:row> 
                                <p:column>
                                    <h:outputLabel id="lblBusqCtaBancaria" value="#{message['movctabancaria.consulta.cuentabancaria']}" class="lblBusqueda"/>
                                </p:column>
                                <p:column colspan="3">
                                    <p:selectOneMenu id="cbxConsultaCtaBancaria_CuentaBancaria" value="#{BKMovCtaBancaria.consultaMovCtaBancaria.idCuentaBancaria.id}"
                                                     style="width: 420px">
                                        <f:selectItems value="#{BKMovCtaBancaria.listaCuentaBancariaConsulta}"/>	
                                    </p:selectOneMenu> 
                                </p:column>
                            </p:row>	
                            <p:row>
                                <p:column>
                                    <h:outputLabel id="lblFechaInicio" value="DEL: " class="lblBusqueda"/>
                                </p:column>
                                <p:column>
                                    <p:calendar id="txtFechaInicio" locale="es" size="19"
                                                value="#{BKMovCtaBancaria.fechaInicio}" 
                                                pattern="dd/MM/yyyy" 
                                                maxdate="#{BKMovCtaBancaria.fechaFinal}"
                                                showOn="button" showButtonPanel="true" navigator="true" >
                                        <p:ajax event="dateSelect" process="@this" update="txtFechaFinal" />
                                    </p:calendar>
                                </p:column>
                                <p:column>
                                    <h:outputLabel id="lblFechaFinal" value="AL: " class="lblBusqueda"/>
                                </p:column>
                                <p:column>
                                    <p:calendar id="txtFechaFinal" locale="es" size="19"
                                                value="#{BKMovCtaBancaria.fechaFinal}" 
                                                pattern="dd/MM/yyyy"
                                                mindate="#{BKMovCtaBancaria.fechaInicio}"
                                                showOn="button" showButtonPanel="true" navigator="true" >
                                        <p:ajax event="dateSelect" process="@this" update="txtFechaInicio"/>
                                    </p:calendar>
                                </p:column> 
                            </p:row>  
                            <p:row>
                                <p:column colspan="4">
                                    <p:commandButton id="btnBuscarMovCtaBancaria" actionListener="#{MBMovimientoCuentaBancaria.buscar}" value="BUSCAR"  
                                                     update="pnlListaMovCtaBancaria,dataTablaMovCtaBancaria" oncomplete="listaMovCtaBancaria.show();buscar.toggle()" 
                                                     styleClass="ui-priority-primary" style="font-size: 12px"/>
                                </p:column> 
                            </p:row>  


                        </p:panelGrid>    


                    </p:panel>    
                    <p:panel id="pnlListaMovCtaBancaria" header="#{message['movctabancaria.resultados.panel.titulo']}" closable="true" style="width: 100%;margin: 10px auto" 
                             visible="#{(BKMovCtaBancaria.listaMovCtaBancaria eq null)?false:true}" widgetVar="listaMovCtaBancaria" >

                        <p:dataTable id="dataTablaCuentas" var="cuenta" value="#{BKMovCtaBancaria.listaCtaBancaria}" widgetVar="carsTable" style="width: 70%;margin: 0 auto"
                                     emptyMessage="No se encontraron cuentas bancarias" filteredValue="" rowIndexVar="rowIndex" styleClass="datable-busqueda"> 

                            <p:column id="idColumnaBanco" sortBy="#{cuenta.idBanco.nombre}" style="width: 20%"> 
                                <f:facet name="header">  
                                    <h:outputText value="Banco" />  
                                </f:facet>
                                <h:outputText value="#{cuenta.idBanco.nombre}" /> 
                            </p:column>

                            <p:column id="idColumnaNroCuentaBancaria" sortBy="#{cuenta.numeroCuenta}" > 
                                <f:facet name="header">  
                                    <h:outputText value="Nro Cuenta" />  
                                </f:facet>
                                <h:outputText value="#{cuenta.numeroCuenta}" style="width: 20%"/> 
                            </p:column>

                            <p:column id="idColumnaMoneda" sortBy="#{cuenta.idTipoMoneda.nombre}" style="width: 15%"> 
                                <f:facet name="header">  
                                    <h:outputText value="Moneda" />  
                                </f:facet>
                                <h:outputText value="#{cuenta.idTipoMoneda.nombre}" /> 
                            </p:column>

                            <p:column id="idColumnaMontoApertura" sortBy="#{cuenta.montoApertura}" style="width: 15%"> 
                                <f:facet name="header">  
                                    <h:outputText value="Monto Apertura" />  
                                </f:facet>
                                <h:outputText value="#{cuenta.montoApertura}" > 
                                    <f:convertNumber minFractionDigits="2" maxFractionDigits="2" />
                                </h:outputText>
                            </p:column>

                            <p:column id="idColumnaMontocActual" sortBy="#{cuenta.montoActual}" style="width: 15%"> 
                                <f:facet name="header">  
                                    <h:outputText value="Monto Actual" />
                                </f:facet>
                                <h:outputText value="#{cuenta.montoActual}" > 
                                    <f:convertNumber minFractionDigits="2" maxFractionDigits="2" />
                                </h:outputText>  
                            </p:column>

                        </p:dataTable>	
                        <br /><br />


                        <p:dataTable id="dataTablaMovCtaBancaria" var="movCtaBancaria" value="#{BKMovCtaBancaria.listaMovCtaBancaria}" widgetVar="lista"
                                     emptyMessage="#{message['movctabancaria.resultados.vacio']}" filteredValue="" rowIndexVar="rowIndex"
                                     paginator="true" rows="20" paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} 
                                     {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" rowsPerPageTemplate="20,40,60"
                                     paginatorPosition="bottom" styleClass="datable-busqueda"> 

                            <p:column id="idColumnaNum"  headerText="Nº" style="width: 4%"  > 
                                <h:outputText value="#{rowIndex+1}" /> 
                            </p:column>    
                            <p:column id="idColumnaCuenta" sortBy="#{movCtaBancaria.idCuentaBancaria.numeroCuenta}"> 
                                <f:facet name="header">  
                                    <h:outputText value="Nº Cuenta" />  
                                </f:facet>
                                <h:outputText value="#{movCtaBancaria.idCuentaBancaria.numeroCuenta} (#{movCtaBancaria.idCuentaBancaria.idBanco.nombre})" /> 
                            </p:column> 

                            <p:column id="idColumnaMotivo" sortBy="#{movCtaBancaria.motivo}"> 
                                <f:facet name="header">  
                                    <h:outputText value="#{message['movctabancaria.resultados.columna.motivo']}" />  
                                </f:facet>
                                <h:outputText value="#{movCtaBancaria.motivo}" /> 
                            </p:column> 
                            <p:column id="idColumnaEstadoMovimiento" sortBy="#{movCtaBancaria.estadoMovimiento}"> 
                                <f:facet name="header">  
                                    <h:outputText value="#{message['movctabancaria.resultados.columna.estadomovimiento']}" />  
                                </f:facet>
                                <h:outputText value="#{movCtaBancaria.descEstadoMovimiento}" /> 
                            </p:column>  
                            <p:column id="idColumnaFormaMovimiento"> 
                                <f:facet name="header">  
                                    <h:outputText value="#{message['movctabancaria.resultados.columna.formamovimiento']}" />  
                                </f:facet>
                                <h:outputText value="#{movCtaBancaria.formaMovimiento}" /> 
                            </p:column>   
                            <p:column id="idColumnaTipoMovimiento" rendered="false"> 
                                <f:facet name="header">  
                                    <h:outputText value="#{message['movctabancaria.resultados.columna.tipomovimiento']}" />  
                                </f:facet>
                                <h:outputText value="#{movCtaBancaria.tipoMovimiento eq 'E' ?'ENTRADA':'SALIDA'}" /> 
                            </p:column>    
                            <p:column id="idColumnaFecha"> 
                                <f:facet name="header">  
                                    <h:outputText value="Fecha" />  
                                </f:facet>
                                <h:outputText value="#{movCtaBancaria.fechaMovimiento}" >
                                    <f:convertDateTime pattern="dd/MM/yyyy" />
                                </h:outputText> 
                            </p:column>    
                            <p:column id="idColumnaMonto"> 
                                <f:facet name="header">  
                                    <h:outputText value="#{message['movctabancaria.resultados.columna.monto']}" />  
                                </f:facet>
                                <h:outputText value="#{movCtaBancaria.tipoMovimiento eq 'E'?'+':'-'}" 
                                              style="#{movCtaBancaria.tipoMovimiento eq 'E'?'color: blue':'color: red'};font-weight: bold">
                                </h:outputText>  
                                <h:outputText value="#{movCtaBancaria.monto}" style="#{movCtaBancaria.tipoMovimiento eq 'E'?'color: blue':'color: red'};font-weight: bold">> 
                                    <f:convertNumber maxFractionDigits="2" minFractionDigits="2" />
                                </h:outputText>
                            </p:column>    
                            <p:column id="idColumnaSaldo"> 
                                <f:facet name="header">  
                                    <h:outputText value="Saldo" />  
                                </f:facet>
                                <h:outputText value="#{movCtaBancaria.saldo}" > 
                                    <f:convertNumber maxFractionDigits="2" minFractionDigits="2" />
                                </h:outputText>
                            </p:column>    
                            <p:column>
                                <f:facet name="header">
                                    <h:outputText value="#{message['general.columna.acciones']}" />  
                                </f:facet>
                                <p:commandButton icon="ui-icon-search" title="#{message['general.columna.boton.title.ver']}"  
                                                 ajax="false" action="#{MBMovimientoCuentaBancaria.ver()}" immediate="true">
                                    <f:setPropertyActionListener value="#{movCtaBancaria}" target="#{BKMovCtaBancaria.seleccionarMovCtaBancaria}" />  
                                </p:commandButton>
                                <p:commandButton icon="ui-icon-pencil" title="#{message['general.columna.boton.title.editar']}" 
                                                 ajax="false" immediate="true" action="#{MBMovimientoCuentaBancaria.editar()}"
                                                 disabled="#{movCtaBancaria.esEditable()}">
                                    <f:setPropertyActionListener value="#{movCtaBancaria}" target="#{BKMovCtaBancaria.formularioMovCtaBancaria}" />  
                                </p:commandButton>  
                                <p:commandButton icon="ui-icon-folder-collapsed" action="#{MBMovimientoCuentaBancaria.sustentarMovimiento}"
                                                 title="#{movCtaBancaria.estadoMovimiento eq 'C'?'ver detalle de movimiento':'sustentar movimiento'}"  
                                                 immediate="true" ajax="false" >
                                    <f:setPropertyActionListener value="#{movCtaBancaria}" target="#{BKMovCtaBancaria.seleccionarMovCtaBancaria}" />  
                                </p:commandButton>
                                <p:commandButton title="Eliminar" icon="ui-icon-trash" process="@this"  oncomplete="confirmarEliminar.show()" disabled="#{movCtaBancaria.esAnulable()}">
                                    <f:setPropertyActionListener value="#{movCtaBancaria}" target="#{BKMovCtaBancaria.seleccionarMovCtaBancaria}" />
                                </p:commandButton>
                            </p:column> 
                        </p:dataTable>    
                    </p:panel>

                    <p:confirmDialog id="dlgEliminarCourier" message="#{message['dialog.confirmacion.mensaje']}" 
                                     header="#{message['dialog.confirmacion.header']}" severity="alert" widgetVar="confirmarEliminar">
                        <p:commandButton id="btnConfEliMov" update="dataTablaMovCtaBancaria dataTablaCuentas" value="Si"  oncomplete="confirmarEliminar.hide()"  
                                         actionListener="#{MBMovimientoCuentaBancaria.eliminar}" process="@this" />  
                        <p:commandButton id="btnCancEliMov" value="No" onclick="confirmarEliminar.hide()" type="button" />   
                    </p:confirmDialog>

                    <p:dialog id="modalDialog" header="TIPO DE MOVIMIENTO" widgetVar="dlg2" modal="true" style="text-align-last: center ">  

                        <h:panelGrid columns="1" style="text-align:center" >
                            <h:outputText value="ELIJA TIPO DE FACTURA PROFORMA A ELABORAR" />                                                                 
                            <p:panel style="text-align: center">
                                <p:selectOneRadio id="options" value="#{BKMovCtaBancaria.tipoMovimiento}" layout="lineDirection" style="text-align: center">  
                                    <f:selectItem itemLabel="ENTRADA" itemValue="E" />  
                                    <f:selectItem itemLabel="SALIDA" itemValue="S" /> 
                                    <f:selectItem itemLabel="TRANSFERENCIA ENTRE CUENTAS" itemValue="T" /> 
                                </p:selectOneRadio>                                      
                            </p:panel>

                            <p:commandButton action="#{MBMovimientoCuentaBancaria.nuevo()}" value="ACEPTAR"  ajax="false" />                                
                        </h:panelGrid>

                    </p:dialog>	

                    <p:confirmDialog id="dlgEliminarMovCtaBancaria" message="#{message['dialog.confirmacion.mensaje']}" 
                                     header="#{message['dialog.confirmacion.header']}" severity="alert" widgetVar="confirmacion">
                        <h:panelGrid style="width: auto;margin:0px auto;border:0px;padding: 0 5px" columns="2">
                            <p:commandButton id="btnConfEliMovCtaBancaria" update="dataTablaMovCtaBancaria" value="Si"  oncomplete="confirmacion.hide()"  
                                             actionListener="#{MBMovimientoCuentaBancaria.eliminar}" immediate="true" />  
                            <p:commandButton id="btnCancEliMovCtaBancaria" value="No" onclick="confirmacion.hide()" type="button" />   
                        </h:panelGrid>

                    </p:confirmDialog>	
                </h:form>
            </f:view>
        </ui:define>
    </ui:composition>    
</html>  
